// Widget
@widget-background-color: @background;
@widget-text-color: @normal-text-color;
@widget-border-color: darken(@background, 12%);
@widget-gradient: false;
@widget-shadow: 0 4px 10px 4px rgba(0, 0, 0, 0.2);
// Button
@button-text-color: lighten(@hover-text-color, 8%);
@button-background-color: @normal-background;
@button-border-color: lighten(@hover-text-color, 8%);
@button-gradient: false;
@button-shadow: false;
@button-hover-text-color: @button-text-color;
@button-hover-background-color: @hover-background;
@button-hover-border-color: @button-border-color;
@button-hover-gradient: false;
@button-hover-shadow: false;
@button-active-background: @selected-background;
@button-active-text-color: @inversed-text-color;
@button-active-border-color: @selected-background;
@button-active-gradient: false;
@button-active-shadow: false;
@button-focused-border-color: @accent;
@button-focused-shadow: false;
@button-focused-active-shadow: false;
// Primary button
@primary-text-color: @inversed-text-color;
@primary-background-color: @accent;
@primary-border-color: @accent;
@primary-gradient: false;
@primary-shadow: false;
@primary-hover-text-color: @primary-text-color;
@primary-hover-background-color: @accent-hover-background;
@primary-hover-border-color: @accent-hover-background;
@primary-hover-gradient: false;
@primary-hover-shadow: false;
@primary-active-text-color: @primary-text-color;
@primary-active-background-color: @accent-hover-background;
@primary-active-border-color: @accent-hover-background;
@primary-active-gradient: false;
@primary-active-shadow: false;
@primary-focused-border-color: @accent-hover-background;
@primary-focused-shadow: false;
@primary-focused-active-shadow: false;
@primary-disabled-text-color: @selected-text-color;
@primary-disabled-background-color: lighten(@accent, 18%);
@primary-disabled-border-color: lighten(@accent, 18%);
@primary-disabled-gradient: false;
@sprite-image: url('@{image-folder}/sprite.png');
@inversed-text-color: contrast(@accent);
@accent-hover-background: multiply(@accent, #e4e4e4);
@link-text-color: #00acc1;
@popups-shadow: 0 0px 6px 1px rgba(0, 0, 0, 0.2);
@tabs-normal-bg: #081421;
@tabs-normal-gradient: "#303553 0%, #072138 100%";
@tabs-hover-bg: #081421;
@tabs-hover-gradient: "#202333 0%, #081421 100%";
@secondary-widget-background-color: darken(@widget-background-color, 2%);
@disabled-text-color: darken(@base, 23%);
@disabled-border-color: darken(@base, 6%);
@disabled-background-color: @widget-background-color;
@disabled-gradient: none;
@inputs-border-radius: 3px;
@input-validation-error: darken(@error, 25%);
@notification-info-background-color: @info;
@notification-info-text-color: darken(@info, 38%);
@notification-info-border-color: @info;
@notification-success-background-color: @success;
@notification-success-text-color: darken(@success, 27%);
@notification-success-border-color: @success;
@notification-warning-background-color: @warning;
@notification-warning-text-color: darken(@warning, 27%);
@notification-warning-border-color: @warning;
@notification-error-background-color: @error;
@notification-error-text-color: darken(@error, 25%);
@notification-error-border-color: @error;
@notification-gradient: false;

@theme-name: ~"nova";

@import "common/mixins.less";
@import "mixins/all.less";
@import "themes/type.less";
@import "themes/button.less";

/* Main colors */
.k-splitbar .k-resize-handle {
    background-color: @normal-text-color;
}

.k-in,
.k-item,
.k-window-action {
    border-color: transparent;
}

.k-block,
.k-widget {
    background-color: @background;
}

.k-block,
.k-widget,
.k-input,
.k-textbox,
.k-group,
.k-content,
.k-header,
.k-filter-row > th,
.k-editable-area,
.k-separator,
.k-textbox > input,
.k-autocomplete,
.k-dropdown-wrap,
.k-toolbar,
.k-group-footer td,
.k-grid-footer,
.k-footer-template td,
.k-state-default,
.k-state-disabled,
.k-grid-header,
.k-grid-header-wrap,
.k-grid-header-locked,
.k-grid-footer-locked,
.k-grid-content-locked,
.k-grid td,
.k-grid td.k-state-selected,
.k-grid-footer-wrap,
.k-pager-wrap,
.k-pager-wrap .k-link,
.k-pager-refresh,
.k-grouping-header,
.k-grouping-header .k-group-indicator,
.k-panelbar > .k-item > .k-link,
.k-panel > .k-item > .k-link,
.k-panelbar .k-panel,
.k-panelbar .k-content,
.k-treemap-tile,
.k-calendar th,
.k-slider-track,
.k-splitbar,
.k-dropzone-active,
.k-tiles,
.k-toolbar,
.k-tooltip,
.k-button-group .k-tool,
.k-upload-files,
.k-popup.k-align .k-list .k-item:last-child,
.k-maskedtextbox.k-state-disabled > .k-textbox:hover,
.k-dateinput.k-state-disabled > .k-textbox:hover {
    border-color: @widget-border-color;
}

.k-group,
.k-toolbar,
.k-grouping-header,
.k-pager-wrap,
.k-group-footer td,
.k-grid-footer,
.k-footer-template td,
.k-widget .k-status,
.k-calendar th,
.k-dropzone-hovered,
.k-popup {
    background-color: @widget-background-color;
}

.k-mediaplayer-toolbar {
    background: fade(@widget-background-color, 85%);
}

.k-header,
.k-grid-header,
.k-grouping-header,
.k-pager-wrap,
.k-state-highlight,
.k-panelbar .k-tabstrip-items .k-item {
    background-color: @accent;
    border-color: @accent;
}

.k-block,
.k-widget,
.k-popup,
.k-content,
.k-toolbar,
.k-dropdown .k-input {
    color: @normal-text-color;
}

.k-popup,
.k-menu .k-menu-group,
.k-grid .k-filter-options,
.k-time-popup,
.k-tooltip {
    .box-shadow(@popups-shadow);
}

.k-content,
.k-panelbar > li.k-item,
.k-panel > li.k-item,
.k-tiles {
    background-color: @background;
}

.k-alt,
.k-separator,
.k-resource.k-alt,
.k-pivot-layout > tbody > tr:first-child > td:first-child {
    background-color: @background;
}

.k-input,
input.k-textbox,
textarea.k-textbox,
input.k-textbox:hover,
textarea.k-textbox:hover,
.k-textbox > input,
.k-multiselect-wrap {
    color: @normal-text-color;
    background-color: @background;
    border-color: @widget-border-color;
}

.k-state-selected {
    background-color: fadeout(@info, 75%);
}

.k-state-focused {
    box-shadow: inset 0 0 0 1px darken(@widget-border-color, 35%);
}

.k-state-hover,
.k-state-hover:hover,
.k-splitbar-horizontal-hover:hover,
.k-splitbar-vertical-hover:hover,
.k-list>.k-state-hover,
.k-pager-wrap .k-link:hover,
.k-dropdown .k-state-focused,
.k-filebrowser-dropzone {
    color: @hover-text-color;
    background-color: @hover-background;
    border-color: @hover-background;
}

.k-state-disabled,
.k-state-disabled .k-link,
.k-dropzone em,
.k-tile-empty strong,
.k-slider .k-draghandle {
    color: @disabled-border-color;
}

/* Border radius */
.k-block,
.k-drag-clue,
.k-touch-scrollbar,
.k-window,
.k-window-titleless .k-window-content,
.k-window-action,
.k-inline-block,
.k-grid .k-filter-options,
.k-grouping-header .k-group-indicator,
.k-notification,
.k-treeview .k-in,
.k-editor-inline,
.k-tile,
.k-slider-track,
.k-slider-selection {
    border-radius: @border-radius;
}

.k-textbox,
.k-autocomplete,
.k-autocomplete .k-input,
.k-multiselect,
.k-combobox,
.k-dropdown,
.k-dropdown-wrap,
.k-datepicker,
.k-timepicker,
.k-colorpicker,
.k-datetimepicker,
.k-numerictextbox,
.k-picker-wrap,
.k-numeric-wrap,
.k-tooltip,
.k-upload {
    border-radius: @inputs-border-radius;
}

.k-dropdown-wrap .k-input,
.k-picker-wrap .k-input,
.k-numeric-wrap .k-input,
.k-toolbar .k-split-button .k-button {
    border-radius: @inputs-border-radius 0 0 @inputs-border-radius;
}

.k-toolbar .k-split-button .k-split-button-arrow {
    border-radius: 0 @inputs-border-radius @inputs-border-radius 0;
}

.k-hr {
    border-color: @widget-border-color;
}

.k-rtl .k-dropdown-wrap .k-input,
.k-rtl .k-picker-wrap .k-input,
.k-rtl .k-numeric-wrap .k-input {
    border-radius: 0 @inputs-border-radius @inputs-border-radius 0;
}

/* Default icons opacity */
.k-button .k-image,
.k-panelbar > .k-state-active > .k-header > .k-icon,
.k-panelbar > .k-state-active > .k-header .k-state-default .k-icon
 {
    opacity: .4;
}

.k-primary .k-icon,
.k-state-active .k-icon,
.k-button:active .k-icon,
.k-numerictextbox .k-state-selected .k-icon,
.k-multiselect-wrap .k-icon,
.k-calendar .k-header .k-icon,
.k-window-titlebar .k-icon,
.k-drag-clue .k-icon,
.k-group-indicator .k-icon,
.k-pivot-toolbar .k-icon,
.k-grid-content .k-button:active .k-icon,
.k-splitbar.k-state-focused .k-icon,
.k-scheduler-toolbar .k-icon,
.k-gantt-toolbar .k-icon,
.k-toolbar .k-overflow-anchor.k-state-border-down .k-i-more-vertical,
.k-panelbar > .k-state-active > .k-header .k-state-active .k-icon {
    opacity: 1;
}

.k-state-disabled .k-icon {
    opacity: .2;
}

/* Loading indicator */
.k-i-loading {
    background-image: url('@{image-folder}/loading.gif');
}

.k-loading-image { background-image: url('@{image-folder}/loading-image.gif'); }
.k-loading-color { background-color: @background; }

// Button
.k-button {
    border-radius: @inputs-border-radius;
}

/* Bare Button */
.k-button.k-bare {
    position: relative;

    &:before {
        content: "";
        background-color: currentcolor;
        opacity: 0.12;
        border-radius: inherit;
        height: 100%;
        width: 100%;
        position: absolute;
        left: 0;
        top: 0;
        display: none;
    }

    &.k-state-focused,
    &:focus {

        &:before {
            display: block;
        }
    }
}

.k-mediaplayer-toolbar .k-button.k-bare {
    &:active,
    &.k-state-active,
    &.k-state-active:hover {
        color: @accent;

        &:before {
            opacity: 0.24;
        }
    }
}

.k-slider.k-mediaplayer-seekbar {
    top: -14px;
}

.k-quality-list {
    margin-left: -25px !important;
}

/* Menu */
.k-menu {
    background-color: @base;
    border-color: @base;
}

.k-menu {
    >.k-item.k-state-hover {
        color: @normal-text-color;
    }

    .k-popup .k-item {
        color: @link-text-color;
    }

    .k-item > .k-state-active {
        color: @selected-text-color;
        background-color: @selected-background;
    }

    .k-state-selected.k-state-hover,
    .k-menu-scroll-button:hover {
        background-color: lighten(@info, 11%);
    }

    .k-state-hover .k-link.k-state-active {
        background-color: @accent-hover-background;
    }
}

/* Inputs */
.k-list-container {
    border-color: darken(@normal-background, 12%);
    background-color: @normal-background;
}

.k-dropdown,
.k-combobox,
.k-datepicker,
.k-datetimepicker,
.k-colorpicker {
    background-color: @widget-background-color;
}

.k-autocomplete.k-state-default,
.k-picker-wrap.k-state-default,
.k-numeric-wrap.k-state-default,
.k-dropdown-wrap.k-state-default {
    background-color: @normal-background;
    border-color: darken(@normal-background, 12%);
}

.k-multiselect.k-header {
    background-color: @widget-background-color;
    border-color: darken(@normal-background, 12%);
}

.k-autocomplete.k-state-hover,
.k-picker-wrap.k-state-hover,
.k-numeric-wrap.k-state-hover,
.k-dropdown-wrap.k-state-hover {
    background-color: @hover-background;
}

.k-autocomplete.k-state-focused,
.k-picker-wrap.k-state-focused,
.k-numeric-wrap.k-state-focused,
.k-dropdown-wrap.k-state-focused,
.k-multiselect.k-header.k-state-focused {
    background-color: @normal-background;
    border-color: lighten(@hover-text-color, 8%);
    box-shadow: none;
}

.k-autocomplete.k-state-active,
.k-picker-wrap.k-state-active,
.k-numeric-wrap.k-state-active,
.k-dropdown-wrap.k-state-active,
.k-multiselect.k-header.k-state-active {
    color: @selected-text-color;
    background-color: @selected-background;
    border-color: @selected-background;
}

.k-textbox.k-state-disabled,
.k-state-disabled .k-picker-wrap,
.k-autocomplete.k-state-disabled,
.k-dropdown-wrap.k-state-disabled,
.k-picker-wrap.k-state-disabled,
.k-multiselect.k-state-disabled,
.k-numeric-wrap.k-state-disabled {
    background-color: @widget-background-color;
    border-color: @disabled-border-color;
}

.k-numerictextbox .k-select,
.k-combobox .k-select,
.k-picker-wrap .k-select {
    border-color: @widget-background-color;
}

.k-autocomplete.k-state-default.k-state-border-up,
.k-autocomplete.k-state-default.k-state-border-down,
.k-picker-wrap.k-state-active .k-select,
.k-numeric-wrap.k-state-active .k-select,
.k-dropdown-wrap.k-state-active .k-select {
    border-color: @selected-background;
}

.k-numeric-wrap .k-link.k-state-selected,
.k-grid .k-numeric-wrap .k-link.k-state-selected {
    background-color: @selected-background;
}

.k-dropdown .k-state-active .k-input {
    color: @selected-text-color;
}

.k-colorpicker .k-selected-color {
    background-color: @widget-background-color;
}

input.k-textbox:focus {
    border-color: lighten(@hover-text-color, 8%);
}

input.k-textbox:active {
    border-color: @selected-background;
}

.k-popup > .k-group-header,
.k-popup > .k-virtual-wrap > .k-group-header {
    background: @selected-background;
    color: @selected-text-color;
}

.k-popup .k-list .k-item {
    color: @link-text-color;
}

.k-group-header + div > .k-list > .k-item.k-first:before {
    border-top-color: @selected-background;
}

.k-popup .k-list .k-state-selected.k-state-focused.k-first:before {
    border-top-color: multiply(@accent, #9a9a9a);
}

.k-popup .k-list .k-item > .k-group {
    background: @selected-background;
    color: @selected-text-color;
}

.k-popup .k-list .k-state-selected {
    color: @selected-text-color;
    background-color: @selected-background;
    border-color: @selected-background;
}

.k-popup .k-list .k-state-focused {
    border-color: darken(@widget-border-color, 27%);
    box-shadow: none;
}

.k-popup .k-list .k-state-selected.k-state-focused {
    border-color: multiply(@accent, #9a9a9a);
}

.k-popup .k-list .k-state-selected.k-state-hover {
    background-color: multiply(@accent, #cccccc);
}

.k-multiselect {
    .k-button {
        color: @inversed-text-color;
        background-color: @accent;
        border-color: @accent;
    }

    &.k-state-focused.k-state-border-up,
    &.k-state-focused.k-state-border-down {
        border-color: @selected-background;
    }

    &.k-header.k-state-focused .k-button,
    &.k-state-focused.k-state-border-up .k-button,
    &.k-state-focused.k-state-border-down .k-button {
        background-color: @selected-background;
        border-color: @selected-background;
    }

    &.k-header.k-state-hover .k-button,
    .k-button:hover,
    .k-button.k-state-hover {
        background-color: @accent-hover-background;
        border-color: @accent-hover-background;
    }
}

.k-list-optionlabel {
    border-color: transparent;
}

.k-nodata {
    color: @disabled-text-color;
}

/* Calendar */
.k-calendar {
    th,
    .k-alt {
        color: lighten(@hover-text-color, 8%);
    }

    td {
        border-radius: 50%;
        border-color: transparent;
    }

    .k-alt {
        border-radius: 0;
        background-color: @secondary-widget-background-color;
        font-weight: normal;
    }

    .k-content .k-link,
    .k-footer .k-link {
        color: @link-text-color;
    }

    .k-state-disabled .k-link{
        color: lighten(@hover-text-color, 23%);
    }

    .k-header .k-link {
        color: @inversed-text-color;
    }

    .k-state-hover {
        border-color: @hover-background;
    }

    .k-state-focused {
        border-color: lighten(@hover-text-color, 8%);
        box-shadow: none;
    }

    .k-header .k-state-hover {
        background-color: @accent-hover-background;
    }

    .k-other-month,
    .k-other-month .k-link {
        color: lighten(@hover-text-color, 8%);
    }

    .k-today {
        background-color: @selected-background;
    }

    .k-today .k-link,
    .k-today.k-state-hover .k-link {
        color: @selected-text-color;
    }

    .k-today.k-state-hover {
        background-color: @accent-hover-background;
        border-color: @accent-hover-background;
    }

    .k-state-selected {
        background-color: lighten(@info, 22%);
        border-color: lighten(@info, 22%);
    }

    .k-state-selected.k-state-hover {
        background-color: lighten(@info, 11%);
        border-color: lighten(@info, 11%);
    }

    .k-today.k-state-selected:active {
        border-color: darken(@widget-border-color, 27%);
    }

    .k-today:active {
        border-color: multiply(@accent, #9a9a9a);
    }

    .k-today.k-state-selected .k-link {
        color: @link-text-color;
    }

    .k-state-selected.k-state-focused {
        border-color: darken(@widget-border-color, 27%);
        box-shadow: none;
    }

    .k-footer {
        border-color: @widget-border-color;
    }
}

// Notification
@import "themes/notification.less";

/* Tooltip */
.k-widget.k-tooltip,
.k-chart-crosshair-tooltip,
.k-chart-shared-tooltip {
    color: @normal-text-color;
    background-color: @widget-background-color;
    border-color: @widget-border-color;
    .box-shadow(@widget-shadow);
}

.k-widget.k-tooltip-validation {
    color: darken(@warning, 25%);
    background-color: @warning;
    border-color: @warning;
    .box-shadow(none);
    border-radius: 0;
}

/* TreeView */
.k-treeview {
    .k-state-hover {
        color: @normal-text-color;
    }

    .k-state-selected {
        color: @accent;
    }
}

/* Splitter */
.k-splitbar {
    background: @widget-background-color;
    border-color: @widget-background-color;
}

.k-splitbar.k-state-focused {
    background-color: @selected-background;
    border-color: @selected-background;
}

/* Window */
.k-window {
    .box-shadow(@widget-shadow);
}

.k-window {
    > .k-header {
        color: @inversed-text-color;
    }

    > .k-header .k-state-hover {
        background-color: @accent-hover-background;
    }
}

/* PanelBar */
.k-panelbar {
    color: @normal-text-color;
    background-color: @widget-background-color;
    border-color: @widget-border-color;
}

.k-panelbar {
    > .k-item .k-panel > .k-item > .k-link,
    > .k-item .k-panel > .k-item .k-panel > .k-item > .k-link,
    .k-panel > .k-item .k-panel .k-item > .k-link {
        color: @normal-text-color;
    }

     .k-item > .k-link.k-header {
        color: @accent;
        background-color: @widget-background-color;
    }

    > .k-item > .k-link.k-state-hover,
    > .k-item .k-panel > .k-item > .k-link.k-state-hover {
        background-color: @hover-background;
    }
}

/* TabStrip */
.k-tabstrip.k-header {
    background-color: @widget-background-color;
}

.k-tabstrip-items {
    .composite-background(@tabs-normal-gradient);
    background-color: @tabs-normal-bg;
}

.k-tabstrip-items {
    .k-item {
        color: @inversed-text-color;
        border-color: transparent;
    }

    .k-item.k-state-hover,
    .k-item.k-state-selected {
        border-top-color: @normal-text-color;
        .composite-background(@tabs-hover-gradient);
        background-color: @tabs-hover-bg;
    }
}

.k-tabstrip-left > .k-tabstrip-items > .k-item.k-state-active {
    border-right-color: @selected-background;
}

.k-tabstrip-right > .k-tabstrip-items > .k-item.k-state-active {
    border-left-color: @selected-background;
}

.k-tabstrip-top > .k-tabstrip-items .k-item.k-state-active {
    .composite-background(@tabs-hover-gradient);
    border-bottom-color: @selected-background;
}

.k-tabstrip-bottom > .k-tabstrip-items > .k-item.k-state-active {
    border-top-color: @selected-background;
}

/* ProgressbBar */
.k-progressbar {
    background: darken(@widget-background-color, 20%);
    border-color: darken(@widget-background-color, 20%);
}

.k-progressbar {
    .k-state-selected {
        background-color: @selected-background;
    }
}

.k-progressbar-horizontal {
    .k-state-selected {
        border-top-color: @selected-background;
        border-bottom-color: @selected-background;
        border-left-color: darken(@normal-background, 12%);
        border-right-color: darken(@normal-background, 12%);
    }

    .k-state-selected.k-first {
        border-left-color: @selected-background;
    }

    .k-state-selected.k-last {
        border-right-color: @selected-background;
    }
}

.k-progressbar-vertical {
    .k-state-selected {
        border-left-color: @selected-background;
        border-right-color: @selected-background;
        border-top-color: darken(@normal-background, 12%);
        border-bottom-color: darken(@normal-background, 12%);
    }

    > .k-complete {
        border-top-color: @selected-background;
        border-bottom-color: @selected-background;
    }

    .k-state-selected.k-first {
        border-top-color: @selected-background;
    }

    .k-state-selected.k-last {
        border-bottom-color: @selected-background;
    }
}

/* Grid */
.k-grid-header,
.k-grid-header .k-header,
.k-pager-wrap,
.k-pager-numbers .k-state-selected,
.k-grid-footer,
.k-grid-footer td,
.k-scheduler-header,
.km-pane-wrapper .k-grid-header .k-header {
    background-color: @secondary-widget-background-color;
    border-color: @widget-border-color;
}

.k-grid-header .k-header .k-link,
.k-grid-header .k-header,
.k-grid-header .k-link,
.k-grid-header .k-link:link,
.k-pager-info,
.k-scheduler-header,
.k-scheduler-agendaview .k-scheduler-datecolumn {
    color: lighten(@hover-text-color, 8%);
}

.k-grid .k-alt {
    background-color: @widget-background-color;
}

.k-grid tr:hover {
    background-color: @hover-background;
}

.k-grid-header th.k-state-focused,
.k-grid td.k-state-focused {
    box-shadow: inset 0 0 0 1px darken(@widget-border-color, 27%);
}

.k-grid-toolbar .k-button,
.k-grid-content .k-button {
    color: @accent;
    border-color: transparent;
}

.k-grid-toolbar .k-button-icontext .k-icon,
.k-grid-content .k-button-icontext .k-icon,
.k-edit-form-container .k-edit-buttons .k-button-icontext .k-icon  {
    display: none;
}

.k-grid-toolbar .k-button:hover {
    border-color: @hover-background;
}

.k-grid-content .k-button-icontext {
    background-color: transparent;
}

.k-grid-content .k-primary {
    color: @inversed-text-color;
    background-color: @accent;
}

.k-grid-toolbar .k-button:active,
.k-grid-content .k-button-icontext:active {
    color: @inversed-text-color;
    background-color: @selected-background;
    border-color: @selected-background;
}

.k-grid-content .k-button:active {
    border-color: @selected-background;
}

.k-header.k-grid-toolbar {
    background-color: @widget-background-color;
    border-color: @widget-border-color;
}

.k-grid .k-grouping-header {
    color: rgba(256, 256, 256, 0.5);
}

.k-grouping-header .k-group-indicator{
    color: @inversed-text-color;
    background-color: @accent-hover-background;
    border-color: @accent-hover-background;
}

.k-group-indicator .k-link {
    color: @inversed-text-color;
}

.k-grouping-row {
    background-color: @secondary-widget-background-color;
    font-weight: bold;
}

.k-group-cell {
    background-color: @secondary-widget-background-color;
}

.k-filter-menu .k-button,
.k-edit-form-container .k-button {
    color: @normal-text-color;
    background: transparent;
    border-color: transparent;
}

.k-filter-menu .k-button:active {
    color: @normal-text-color;
}

.k-filter-menu .k-primary,
.k-edit-form-container .k-primary {
    color: @accent;
}

.k-filter-menu .k-primary {
    border-left-color: @widget-border-color;
}

.k-filter-menu>div>div:last-child {
    border-color: @widget-border-color;
}

.k-grid td.k-state-selected,
.k-grid tr.k-state-selected > td {
    border-color: fadeout(@widget-border-color, 20%);
}

.k-grid tr.k-state-selected,
.k-grid td.k-state-selected,
.k-grid td.k-state-selected.k-state-focused {
    background-color: lighten(@info, 22%);
}

.k-grid td.k-state-selected:hover,
.k-grid tr.k-state-selected:hover td {
    background-color: lighten(@info, 17%);
}

.k-grid tr:hover .k-state-focused.k-state-selected,
.k-grid tr.k-state-selected:hover td.k-state-focused {
    box-shadow: inset 0 0 0 1px darken(@widget-border-color, 35%);
}

.k-marquee-color {
    background-color: desaturate(@info, 8%);
}

/* PivotGrid */
.k-alt,
.k-grid.k-alt,
.k-fieldselector .k-item.k-header {
    background-color: @secondary-widget-background-color;
    border-color: @widget-border-color;
}

.k-pivot-toolbar .k-button {
    color: @inversed-text-color;
    background-color: @accent-hover-background;
    border-color: @accent-hover-background;
}

.k-pivot-toolbar .k-empty {
    color: rgba(256, 256, 256, 0.5);
}

.k-fieldselector .k-item.k-header.k-state-hover {
    color: @normal-text-color;
}

.k-grid-footer td,
.k-pivot-rowheaders .k-grid-footer {
    font-weight: bold;
}

.k-grid .k-filter-row:hover,
.k-pivot-rowheaders .k-grid tr:hover {
    background: none;
}

/* Pager */
.k-pager-wrap,
.k-pager-numbers .k-link,
.k-pager-numbers .k-link:link {
    color: @normal-text-color;
}

.k-pager-wrap .k-link {
    border-color: @secondary-widget-background-color;
}

.k-pager-wrap .k-link:hover {
    background-color: transparent;
    border-color: transparent;
}

.k-pager-numbers .k-state-selected {
    color: @selected-background;
    border-color: @selected-background transparent transparent;
    border-radius: 0;
}

/* Scheduler */
.k-scheduler th,
.k-scheduler tr,
.k-scheduler td {
    border-color: @widget-border-color;
}

.k-scheduler-table td.k-state-selected {
    background-color: lighten(@info, 22%);
}

.k-scheduler-toolbar {
    border-color: @secondary-widget-background-color;
}

.k-scheduler .k-header .k-button,
.k-scheduler .k-header li,
.k-scheduler .k-header .k-link {
    color: @inversed-text-color;
}

.k-scheduler .k-header .k-button {
    color: @inversed-text-color;
    background-color: @accent-hover-background;
    border-color: @accent-hover-background;
}

.k-scheduler .k-header li,
.k-scheduler .k-header .k-link,
.k-gantt>.k-header li {
    border-color: @accent;
}

.k-scheduler .k-scheduler-toolbar ul li.k-state-hover,
.k-scheduler .k-scheduler-toolbar .k-state-selected {
    background-color: @selected-background;
    border-color: @selected-background;
}

.k-scheduler .k-header .k-button:hover,
.k-scheduler .k-scheduler-toolbar .k-scheduler-views li.k-state-hover,
.k-scheduler .k-scheduler-toolbar .k-scheduler-views li.k-state-hover .k-link {
    background-color: @accent-hover-background;
    border-color: @accent-hover-background;
}

.k-scheduler .k-scheduler-toolbar .k-scheduler-views li.k-state-selected.k-state-hover,
.k-scheduler-toolbar>.k-scheduler-views>li.k-state-selected {
    border-bottom-color: @widget-background-color;
}

.k-scheduler-footer {
    border-color: @widget-border-color;
}

.k-scheduler-footer > .k-header li {
    border-color: transparent;
}

.k-scheduler-footer > .k-header {
    background-color: @secondary-widget-background-color;
    border-color: @widget-border-color;
}

.k-scheduler-footer > .k-header .k-link {
    color: @link-text-color;
}

.k-event,
.k-task-complete {
    color: @inversed-text-color;
    background: darken(@info, 21%);
    border-color: darken(@info, 21%);
}

.k-event.k-state-selected {
    .box-shadow(0 0 0 2px @normal-text-color);
}

/* Gantt */
.k-gantt .k-treelist,
.k-gantt .k-treelist .k-alt,
.k-gantt .k-header.k-nonwork-hour,
.k-gantt .k-treelist .k-alt,
.k-gantt .k-header.k-nonwork-hour {
    background-color: @secondary-widget-background-color;
}

.k-gantt .k-treelist .k-state-selected,
.k-gantt .k-treelist .k-state-selected td,
.k-gantt .k-treelist .k-alt.k-state-selected,
.k-gantt .k-treelist .k-alt.k-state-selected > td {
    background-color: lighten(@info, 22%);
}

.k-gantt-toolbar {
    border-color: @secondary-widget-background-color;
}

.k-gantt-toolbar .k-button {
    background-color: @accent;
    border-color: @accent;
}

.k-gantt>.k-header li,
.k-gantt>.k-header .k-link,
.k-gantt-toolbar .k-button {
    color: @inversed-text-color;
}

.k-gantt .k-gantt-toolbar .k-gantt-views li.k-state-hover,
.k-gantt .k-gantt-toolbar .k-gantt-views li.k-state-hover .k-link,
.k-gantt .k-gantt-toolbar .k-button:hover {
    background-color: @accent-hover-background;
    border-color: @accent-hover-background;
}

.k-gantt-toolbar>.k-gantt-views>li.k-state-selected,
.k-gantt .k-gantt-toolbar .k-gantt-views li.k-state-selected.k-state-hover {
    border-bottom-color: @widget-background-color;
}

.k-gantt-toolbar li:first-child,
.k-gantt-toolbar li:first-child>.k-link,
.k-gantt-toolbar li:last-child,
.k-gantt-toolbar li:last-child>.k-link {
    border-radius: 0;
}

.k-gantt .k-task-draghandle {
    border-color: darken(@info, 21%);
}

.k-task-dot:after {
    background-color: lighten(@hover-text-color, 8%);
    border-color: lighten(@hover-text-color, 8%);
}

.k-task-dot:hover:after {
    background-color: @normal-text-color;
    border-color: @normal-text-color;
}

.k-task-summary {
    background: darken(@normal-background, 12%);
}

.k-task-milestone {
    background-color: darken(@success, 25%);
}

.k-task-summary-complete {
    background: @normal-text-color;
}

.k-state-selected.k-task-summary {
    background: lighten(@info, 4%);;
}

.k-state-selected.k-task-milestone,
.k-state-selected .k-task-summary-complete {
    background-color: lighten(@info, 22%);
    border-color: lighten(@info, 22%);
}

.k-task-single {
    color: @inversed-text-color;
    background-color: lighten(@info, 4%);
    border-color: lighten(@info, 4%);
}

.k-state-selected.k-task-single {
    border-color: @accent;
}

.k-line {
    background-color: @normal-text-color;
    color: @normal-text-color;
}

.k-state-selected.k-line {
    background-color: @accent;
    color: @accent;
}

.k-resource {
    background-color: @widget-background-color;
}

/* Editor */
.k-editor.k-header,
.editorToolbarWindow.k-header,
.k-filebrowser .k-header {
    background-color: @widget-background-color;
    border-color: @widget-border-color;
}

.k-editor .k-tool.k-state-selected,
.k-window .k-editor-toolbar .k-tool.k-state-selected {
    background-color: lighten(@hover-text-color, 8%);
    border-color: lighten(@hover-text-color, 8%);
}

.k-window .k-editor-toolbar .k-state-hover {
    background-color: @hover-background;
}

/* Toolbar */
.k-toolbar {
    .k-button,
    .k-button-group {
        color: @normal-text-color;
        border-color: @widget-border-color;
    }

    .k-button:active,
    .k-button.k-state-active {
        color: @inversed-text-color;
    }

    .k-button-group .k-button {
        border-color: transparent;
    }

    .k-button-group .k-button:active,
    .k-button-group .k-button.k-state-active,
    .k-overflow-anchor.k-state-active,
    .k-toggle-button.k-state-active {
        background-color: lighten(@hover-text-color, 8%);
    }

    .k-overflow-anchor.k-state-active {
        border-color: lighten(@hover-text-color, 8%);
    }

    .k-overflow-anchor.k-state-border-down,
    .k-overflow-anchor.k-state-border-up {
        background-color: @selected-background;
        border-color: @selected-background;
    }

    .k-button.k-state-disabled,
    .k-button.k-state-disabled:hover,
    .k-button.k-state-disabled:active {
        color: @disabled-text-color;
        border-color: lighten(@hover-text-color, 20%);
        background-color: @widget-background-color;
    }
}

.k-overflow-container .k-overflow-button,
.k-split-container .k-button {
    color: @link-text-color;
}

.k-overflow-container .k-overflow-button.k-state-active,
.k-split-container .k-button.k-state-active {
    color: @selected-text-color;
}

/* Upload */
.k-file,
.k-upload {
    background-color: @widget-background-color;
    border-color: @widget-border-color;
}

.k-dropzone .k-upload-status {
    color: lighten(@hover-text-color, 8%);
}
.k-file .k-upload-status {
    color: @normal-text-color;
}

.k-file-progress {
    color: @normal-text-color;
}

.k-file-progress .k-progress {
    background-color: darken(@info, 25%);
}

.k-file-success .k-file-name,
.k-file-success .k-upload-pct {
    color: darken(@success, 25%);
}

.k-file-success .k-progress {
    background-color: darken(@success, 25%);
}

.k-file-error {
    color: darken(@error, 25%);

    .k-file-extension-wrapper,
    .k-multiple-files-extension-wrapper {
        color: darken(@error, 25%);
        border-color: darken(@error, 25%);
    }

    .k-file-extension-wrapper:before,
    .k-multiple-files-extension-wrapper:before {
        background-color: @widget-background-color;
        border-color: transparent transparent darken(@error, 25%) darken(@error, 25%);
    }
}

.k-file-error .k-progress {
    background-color: @accent;
}

.k-file-extension-wrapper,
.k-multiple-files-extension-wrapper {
    color: @disabled-text-color;
    border-color: @disabled-text-color;
}

.k-file-invalid .k-file-name-invalid {
    color: darken(@error, 25%);
}

.k-file-invalid-extension-wrapper,
.k-multiple-files-invalid-extension-wrapper {
    color: darken(@error, 25%);
    border-color: darken(@error, 25%);
}

.k-file-extension-wrapper:before,
.k-multiple-files-extension-wrapper:before {
    background-color: @widget-background-color;
    border-color: transparent transparent @disabled-text-color @disabled-text-color;
}

.k-file-invalid-extension-wrapper:before,
.k-multiple-files-invalid-extension-wrapper:before {
    background-color: @widget-background-color;
    border-color: transparent transparent darken(@error, 25%) darken(@error, 25%);
}

.k-multiple-files-extension-wrapper:after {
    border-top-color: @disabled-text-color;
    border-left-color: @disabled-text-color;
}

.k-multiple-files-invalid-extension-wrapper:after {
    border-top-color: darken(@error, 25%);
    border-left-color: darken(@error, 25%);
}

.k-file-size,
.k-file-information,
.k-file-validation-message {
    color: @disabled-text-color;
}

.k-upload .k-upload-selected {
    color: @accent;
    border-color: @widget-border-color;

    &:hover {
        color: @selected-text-color;
        background-color: @accent;
    }
}

/* Slider */
.k-slider-track {
    background-color: darken(@widget-background-color, 12%) ;
}

.k-slider-selection {
    background-color: @selected-background;
}

.k-slider-horizontal .k-tick {
    background-image:url('@{image-folder}/slider-h.gif');
}

.k-slider-vertical .k-tick {
    background-image:url('@{image-folder}/slider-v.gif');
}

.k-draghandle {
    background-color: @widget-background-color;
    border-color: @widget-border-color;
    .box-shadow(@popups-shadow);
    border-radius: 50%;
}

.k-draghandle:hover {
    background-color: @hover-background;
}

/* ColorPicker */
.k-flatcolorpicker .k-hue-slider .k-draghandle {
    background-color: @widget-background-color;
    border-color: @widget-background-color;
    .box-shadow(@popups-shadow);
    border-radius: 50%;
}

.k-flatcolorpicker .k-hue-slider .k-draghandle:hover,
.k-flatcolorpicker .k-transparency-slider .k-draghandle:hover,
.k-flatcolorpicker .k-hue-slider .k-draghandle:focus,
.k-flatcolorpicker .k-transparency-slider .k-draghandle:focus {
    background-color: @hover-background;
    border-color: @hover-background;
    .box-shadow(@popups-shadow);
}

@import "themes/checkbox.less";

@checkbox-border-color: darken(@widget-background-color, 12%);
@checkbox-border-radius: @inputs-border-radius;
@checkbox-background-color: @widget-background-color;
@checkbox-hover-border-color: @checkbox-border-color;
@checkbox-hover-box-shadow: none;
@checkbox-checked-border-color: darken(@widget-background-color, 12%);
@checkbox-checked-background-color: @widget-background-color;
@checkbox-active-border-color: @accent;
@checkbox-active-box-shadow: none;
@checkbox-indeterminate-border-radius: 0;

@import "themes/radiobutton.less";

@radio-hover-border-color: darken(@base, 12%);
@radio-active-border-color: @accent;
@radio-active-box-shadow: none;

.k-radio:checked + .k-radio-label:hover:before,
.k-radio:checked + .k-radio-label:active:before {
    border-color: @accent;
}

.k-radio:disabled:checked + .k-radio-label:hover:before {
    border-color: @radio-border-color;
}

/* Drag & Drop */
.k-drag-clue {
    color: @inversed-text-color;
    .box-shadow(@widget-shadow);
}

/* Adaptive Grid */
.k-grid-mobile .k-column-active + th.k-header {
    border-left-color: @widget-border-color;
}

.km-header {
    color: @accent;
    background-color: @widget-background-color;
    border-color: @widget-background-color;
    .box-shadow(@popups-shadow);
}

.km-pane-wrapper > .km-pane > .km-view > .km-content {
    background-color: @secondary-widget-background-color;
}

.km-header .k-button,
.km-header .k-button:hover {
    color: @accent;
    border-color: @widget-background-color;
    background-color: @widget-background-color;
}

html .km-pane-wrapper .km-widget,
.k-ie .km-pane-wrapper .k-widget,
.k-ie .km-pane-wrapper .k-group,
.k-ie .km-pane-wrapper .k-content,
.k-ie .km-pane-wrapper .k-header,
.k-ie .km-pane-wrapper .k-popup-edit-form .k-edit-field .k-button,
.km-pane-wrapper .k-mobile-list .k-item,
.km-pane-wrapper .k-mobile-list .k-edit-label,
.km-pane-wrapper .k-mobile-list .k-edit-field {
    color: @normal-text-color;
}

@media screen and (-ms-high-contrast: active)
              and (-ms-high-contrast: none) {
    div.km-pane-wrapper a     {
        color: @normal-text-color;
    }
}

.km-pane-wrapper .k-mobile-list .k-check,
.km-pane-wrapper .k-mobile-list .k-edit-field textarea {
    outline: none;
}

.km-pane-wrapper .k-mobile-list .k-item.k-state-selected {
    color: @selected-text-color;
    background-color: @selected-background;
    border-top-color: @selected-background;
}

.km-pane-wrapper .k-mobile-list > ul > li > .k-link,
.km-pane-wrapper .k-mobile-list .k-recur-view > .k-edit-label:nth-child(3),
.km-pane-wrapper #recurrence .km-scroll-container > .k-edit-label:first-child {
    color: normal-text-color;
}

.km-pane-wrapper .k-mobile-list .k-item:last-child,
.km-pane-wrapper .k-mobile-list > ul > li > .k-link {
    border-bottom: 1px solid @widget-border-color;
}

.km-actionsheet .k-grid-delete,
.km-actionsheet .k-scheduler-delete,
.km-pane-wrapper .k-scheduler-delete,
.km-pane-wrapper .k-filter-menu .k-button[type=reset] {
    color: #fff;
    border-color: red;
    background-color: red;
}

.km-actionsheet .k-grid-delete:active,
.km-actionsheet .k-scheduler-delete:active,
.km-pane-wrapper .k-scheduler-delete:active,
.km-pane-wrapper .k-filter-menu .k-button[type=reset]:active {
    background-color: darken(red, 20);
}

.k-mobile-list .k-check:checked,
.k-mobile-list .k-edit-field [type=checkbox]:checked,
.k-mobile-list .k-edit-field [type=radio]:checked {
    opacity: .4;
}

/* IE will ignore the above selectors if these are added too */
.k-mobile-list .k-check:checked,
.k-mobile-list .k-edit-field [type=checkbox]:checked,
.k-mobile-list .k-edit-field [type=radio]:checked {
    background-image: @sprite-image;
    border-color: transparent;
}

.k-mobile-list .k-item > .k-link:active,
.k-mobile-list .k-item > .k-label:active,
.k-mobile-list .k-edit-label.k-check:active,
.k-mobile-list .k-recur-view .k-check:active {
    color: @hover-text-color;
    background-color: @hover-background;
    border-color: @hover-text-color;
}

.km-pane-wrapper .k-mobile-list .k-item,
.km-pane-wrapper .k-mobile-list .k-edit-field,
.km-pane-wrapper .k-mobile-list .k-recur-view > .k-edit-field .k-check {
    background-color: @widget-background-color;
    border-top: 1px solid @widget-border-color;
}

.km-pane-wrapper .k-mobile-list .k-recur-view > .k-edit-field .k-check:first-child {
    border-top-color: transparent;
}

.km-pane-wrapper .km-pane .k-mobile-list.k-filter-menu {
    .k-space-right {
        background: @base;
        border-color: @widget-border-color;

        > input {
            background-color: @background;
            border-color: @widget-border-color;
        }

        > input:focus {
            border-color: lighten(@hover-text-color, 8%);
        }
    }
}

/* Responsive styles */
@media only screen and (max-width: 1450px) {
    .k-webkit,
    .k-ff,
    .k-ie11,
    .k-edge,
    .k-safari {
        /* Responsive Scheduler */
        .k-scheduler-toolbar .k-nav-current {
            margin: 0;
        }
    }
}

@media only screen and (max-width: 1400px) {
    .k-webkit,
    .k-ff,
    .k-ie11,
    .k-edge,
    .k-safari {
        /* Responsive Scheduler */
        .k-nav-current > .k-link .k-lg-date-format {
            max-width: 100px;
            display: inline-block;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            vertical-align: top;
        }

        .k-nav-current > .k-link .k-sm-date-format {
            display: none;
        }

        .k-scheduler-toolbar .k-link {
            padding: 0 .5em;
        }
    }
}

@media only screen and (max-width: 1420px) {
    .k-webkit,
    .k-ff,
    .k-ie11,
    .k-edge,
    .k-safari {
        .k-scheduler .k-scheduler-toolbar .k-nav-current .k-link .k-i-calendar {
            display: none;
        }
    }
}

@media only screen and (max-width: 1024px) {
    .k-webkit,
    .k-ff,
    .k-ie11,
    .k-edge,
    .k-safari {
        .k-scheduler-toolbar > ul.k-scheduler-views {
            right: 13px;
            top: 0;
        }

        .k-gantt-toolbar > ul.k-gantt-views > li.k-current-view,
        .k-gantt-toolbar > ul.k-gantt-views > li.k-current-view:hover,
        .k-scheduler-toolbar > ul.k-scheduler-views > li.k-current-view,
        .k-scheduler-toolbar > ul.k-scheduler-views > li.k-current-view:hover {
            background-position: 50% 50%;
            color: @selected-text-color;
            background-color: @selected-background;
            border-color: @selected-background;
            text-align: right;
        }

        .k-gantt-toolbar > ul.k-gantt-views.k-state-expanded > li,
        .k-scheduler-toolbar > ul.k-scheduler-views.k-state-expanded > li {
            border-radius: 0;
        }

        .k-gantt-toolbar > ul.k-gantt-views.k-state-expanded > .k-state-hover,
        .k-scheduler-toolbar > ul.k-scheduler-views.k-state-expanded > .k-state-hover {
            background-color: @hover-background;
        }

        .k-gantt-toolbar > ul.k-gantt-views.k-state-expanded >.k-state-selected,
        .k-scheduler-toolbar > ul.k-scheduler-views.k-state-expanded >.k-state-selected {
            color: @selected-text-color;
            background-color: @selected-background;
        }

        .k-gantt-toolbar > ul.k-gantt-views.k-state-expanded >.k-state-hover .k-link,
        .k-scheduler-toolbar > ul.k-scheduler-views.k-state-expanded >.k-state-hover .k-link {
            background-color: transparent;
        }

        .k-gantt-toolbar > ul.k-gantt-views.k-state-expanded > li.k-current-view .k-link,
        .k-scheduler-toolbar > ul.k-scheduler-views.k-state-expanded > li.k-current-view .k-link {
            color: @inversed-text-color;
        }

        .k-scheduler-toolbar > ul li:first-child, .k-scheduler-toolbar > ul li:first-child .k-link,
        .k-scheduler-toolbar > ul.k-scheduler-views li,
        .k-scheduler-toolbar > ul.k-scheduler-views li .k-link {
            border-radius: 0;
        }

        .k-scheduler-toolbar > ul.k-scheduler-views > li.k-current-view > .k-link,
        .k-scheduler-toolbar > ul.k-scheduler-views > li.k-current-view:hover > .k-link {
            min-width: 20px;
        }

        .k-gantt-toolbar > ul.k-gantt-views.k-state-expanded .k-link,
        .k-scheduler-toolbar > ul.k-scheduler-views.k-state-expanded .k-link {
            color: @link-text-color;
        }

        .k-gantt-toolbar > ul.k-gantt-views.k-state-expanded .k-state-selected .k-link,
        .k-scheduler-toolbar > ul.k-scheduler-views.k-state-expanded .k-state-selected .k-link {
            color: @selected-text-color;
        }

        .k-scheduler-views > li.k-state-selected > .k-link:after {
            display: block;
            content: "";
            position: absolute;
            top: 50%;
            margin-top: -0.5em;
            right: 0.333em;
            width: 1.333em;
            height: 1.333em;
            opacity: 0.45;
        }

        .k-scheduler-toolbar > ul.k-scheduler-views > li.k-current-view .k-link:after {
            background-position: -14px -30px;
        }

        .k-scheduler-toolbar > ul.k-scheduler-views.k-state-expanded {
            border-width: 1px 1px 0 1px;
            border-style: solid;
        }

        .k-scheduler-toolbar > ul.k-scheduler-views.k-state-expanded {
            border-width: 1px;
            background-image: none;
        }

        /* Responsive Pager */

        .k-pager-wrap
        {
            min-height: 2.7em;
        }

        .k-pager-wrap .k-pager-nav,
        .k-pager-input {
            display: inline-block;
            vertical-align: top;
        }

        .k-pager-numbers,
        .k-grid .k-pager-numbers {
            position: absolute;
            left: 5.6em;
            display: -moz-inline-flex;
            display: -webkit-inline-flex;
            display: inline-flex;
            -webkit-flex-direction: column-reverse;
            flex-direction: column-reverse;
            overflow: visible;
            height: auto;
            background-color: @normal-background;
            border: 1px solid darken(@normal-background, 12%);
            border-radius: 3px;
        }

        .k-pager-numbers:first-child,
        .k-grid .k-pager-numbers:first-child { // move left when previousNext: false
            left: .3em;
        }

        .k-pager-numbers:hover,
        .k-pager-wrap .k-pager-numbers li:hover {
            background-color: @hover-background;
        }

        .k-pager-numbers.k-state-expanded,
        .k-grid .k-pager-numbers.k-state-expanded {
            -webkit-transform: translatey(-100%);
            -moz-transform: translatey(-100%);
            transform: translatey(-100%);
        }

        .km-pane-wrapper .k-pager-numbers,
        .km-pane-wrapper .k-grid .k-pager-numbers {
            position: relative;
            left: 50%;
            transform: translate(-50%, 0%);
            -webkit-transform: translate(-50%, 0%);
        }
        .km-pane-wrapper .k-pager-numbers.k-state-expanded,
        .km-pane-wrapper .k-grid .k-pager-numbers.k-state-expanded {
            -webkit-transform: translate(-50%, -100%);
            transform: translate(-50%, -100%);
        }

        .km-pane-wrapper .k-pager-numbers .k-link,
        .km-pane-wrapper .k-pager-numbers .k-state-selected,
        .km-pane-wrapper .k-pager-wrap > .k-link,
        .km-pane-wrapper .k-pager-wrap > .k-pager-info {
            padding-top: 0;
            padding-bottom: 0;
        }

        .k-rtl .k-pager-numbers,
        .k-rtl .k-grid .k-pager-numbers {
            right: 5.6em;
            width: 5.15em;
        }

        .k-rtl .k-pager-numbers:first-child,
        .k-rtl .k-grid .k-pager-numbers:first-child { // move right when previousNext: false
            left: auto;
            right: .3em;
        }

        .k-pager-numbers .k-current-page,
        .k-grid .k-pager-numbers .k-current-page {
            display: block;
            border-left: 0;
        }

        .k-pager-numbers li:not(.k-current-page) {
            display: none;
        }

        .k-pager-numbers .k-current-page .k-link {
            width: 3.8em;
            line-height: 2.564em;
            padding: 0 .429em 0 0.8em;
            border-radius: 3px;
            background-position: 50% 50%;
            background-color: @normal-background;
            border: 1px solid transparent;
        }

        .k-pager-numbers .k-current-page .k-link:hover {
            background-color: @hover-background;
        }

        .k-pager-numbers .k-current-page:hover .k-link {
            border-top: 0;
        }

        .k-pager-numbers .k-current-page .k-link:after {
            display: block;
            content: "";
            position: absolute;
            top: 50%;
            margin-top: -0.6em;
            right: 0.6em;
            width: 1.333em;
            height: 1.333em;
            opacity: .45;
        }

        .k-pager-numbers.k-state-expanded .k-current-page .k-link:after {
            background-position: -15px 0;
            opacity: 1;
        }

        .k-pager-numbers + .k-link {
            margin-left: 5.4em;
        }

        .k-rtl .k-pager-numbers + .k-link {
            margin-right: 5.4em;
            margin-left: 0;
        }

        .k-pager-wrap .k-pager-numbers .k-state-selected,
        .k-pager-wrap .k-pager-numbers .k-link {
            color: @link-text-color;
            display: block;
            margin-top: 0;
            margin-right: 0;
            padding: 1px 5px 1px .8em;
            text-align: left;
            border-top: 0;
        }

        .k-pager-wrap .k-pager-numbers .k-pager-nav{
            color: @normal-text-color;
        }

        .k-pager-wrap .k-pager-numbers .k-state-selected {
            color: @selected-text-color;
            background-color: @selected-background;
            border-color: @selected-background;
        }

        .k-pager-numbers.k-state-expanded {
            box-sizing: border-box;
            padding: 2px 0 0;
            border-width: 1px 1px 0 1px;
            border-style: solid;
            border-color: @widget-border-color;
            background-color: @widget-background-color;
            .box-shadow(@popups-shadow);
        }

        .k-pager-numbers.k-state-expanded .k-current-page {
            margin: -2.2em -1px 0;
            padding: 0;
        }

        .k-pager-numbers.k-state-expanded .k-current-page .k-link {
            border-radius: 0 0 3px 3px;
            border-top: 0;
            color: @selected-text-color;
            background-color: @selected-background;
            border-color: @selected-background;
        }

        .k-pager-numbers.k-state-expanded li {
            display: inline-block;
        }

        .k-gantt-toolbar > ul.k-gantt-views {
            top: 0;
        }

        .k-widget.k-grid .k-pager-nav + .k-pager-numbers {
            position: absolute;
        }
    }
}

@media only screen and (max-width: 678px) {
    .k-webkit,
    .k-ff,
    .k-ie11,
    .k-edge,
    .k-safari {
        .k-pager-info {
            display: none;
        }
    }
}

@media only screen and (max-width: 530px) {
    .k-webkit,
    .k-ff,
    .k-ie11,
    .k-edge,
    .k-safari {
        .k-pager-sizes {
            display: none;
        }
    }
}

@media only screen and (max-width: 350px) {
    .k-webkit,
    .k-ff,
    .k-ie11,
    .k-edge,
    .k-safari {
        .k-pager-refresh {
            display: none;
        }
    }
}

/* Stock Chart */
.k-chart .k-mask {
    background-color: @widget-background-color;
    filter: alpha(opacity=68);
    -moz-opacity: 0.68;
    opacity: 0.68;
}

.k-chart .k-selection {
    border-color: @widget-border-color;
}

.k-chart .k-handle {
    width: 15px;
    height: 15px;
    border-width: 1px;
    border-style: solid;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.k-chart .k-left-handle {
    left: -8px;
}

.k-chart .k-right-handle {
    right: -8px;
}

.k-chart .k-handle:hover {
    background-color: @hover-background;
}

.k-chart .k-navigator-hint .k-tooltip {
    border: @widget-border-color;
   .box-shadow(@popups-shadow);
    background: @widget-background-color;
    color: @normal-text-color;
}

.k-chart .k-navigator-hint .k-scroll {
    background: @base;
    height: 4px;
}

.k-chart-tooltip {
    background-image: none;
}

/* Map */
.k-map .k-header {
    background-color: @widget-background-color;
    border-color: @widget-border-color;
}

.k-map .k-marker {
    font-size: 28px;
    color: @accent;
}

.k-map .k-attribution {
    color: #666666;
}

@import "themes/spreadsheet.less";

@spreadsheet-selection-border: #26c6da;
@spreadsheet-selection-background: fadeout(@spreadsheet-selection-border, 80%);

@active-header-text: contrast(@accent);
@inactive-header-text: contrast(@accent);

.k-spreadsheet {
    .k-spreadsheet-quick-access-toolbar,
    .k-spreadsheet-sheets-bar {
        .k-button {
            box-shadow: none;
            color: @active-header-text;
            border-radius: 0;
            line-height: 2.6em;
            height: calc(3.1em + 2px); // IE centering icon fix
            width: 3em;

            &:hover {
                .composite-background(@tabs-hover-gradient);
                border-color: saturate(@normal-text-color, 7%);
            }
        }
    }

    .k-spreadsheet-sheets-bar .k-button {
        padding-top: .5em;
        padding-bottom: .5em;
        line-height: 2.2em;
    }

    .k-spreadsheet-sheets-bar-add {
        left: 0;
        bottom: 0;
    }

    .k-spreadsheet-sheets-remove {
        margin: 0 0 0 -1em;
    }
}

.k-spreadsheet-sheets-items {
    .composite-background(@tabs-normal-gradient);
}

.k-spreadsheet-sheets-items,
.k-spreadsheet-tabstrip {
    .k-state-default .k-link {
        color: @inactive-header-text;
    }

    .k-item.k-state-hover,
    .k-item.k-state-active,
    .k-item.k-state-focused {
        background-color: transparent;

        .k-link {
            color: @active-header-text;
        }
    }

    .k-state-active .k-link {
        color: @active-header-text;
    }
}

.k-spreadsheet-toolbar {

    > .k-button {
        border-color: transparent;
    }
}

@spreadsheet-page-orientation-border-color: lighten(@hover-text-color, 8%);

.k-grid {
    input.k-checkbox {
        width: 16px;
        height: 17px;
    }
}

.k-window .k-popup-edit-form .k-edit-field {
    input.k-checkbox {
        width: 16px;
        height: 17px;
        margin-top: 1.1em;
    }

    label.k-checkbox-label {
        margin-top: 0.8em;
    }
}

/* Dialog */

.k-dialog {
    .k-window-titlebar {
        height: auto;
        width: auto;
        display: block;
        font-size: 1em;
        padding: 1em;
        .k-dialog-title {
            display: inline-block;
            padding: 0;
            padding-right: 2em;
            margin: 0;
            width: auto;
            white-space: normal;
            overflow: unset;
            text-overflow: inherit;
            font-size: 1em;
            line-height: 1.2em;
            box-sizing: content-box;
        }
    }
    a.k-dialog-action.k-dialog-close.k-button.k-bare {
        &:before {
            content: normal;
        }
    }
    &.k-alert .k-window-titlebar,
    &.k-confirm .k-window-titlebar,
    &.k-prompt .k-window-titlebar {
        .k-dialog-title {
            color: @normal-text-color;
        }
        border-bottom: none;
    }
    .k-content {
        border-bottom-right-radius: @border-radius;
        border-bottom-left-radius: @border-radius;
    }
    &.k-dialog-titleless .k-content {
        border-top-right-radius: @border-radius;
        border-top-left-radius: @border-radius;
    }
    .k-dialog-buttongroup {
        &.k-dialog-button-layout-stretched {
            width: 100%;
            .k-button {
                display: inline-block;
                padding: 1em 0 1em 0;
                border-radius: 0;
                border-bottom: 0;
                border-width: 1px 0 0 1px;
            }
            .k-button:first-child {
            border-bottom-left-radius: @border-radius;
            border-left: 0;
            }
            .k-button:last-child {
                border-bottom-right-radius: @border-radius;
                border-right: 0;
            }
        }
        &.k-dialog-button-layout-normal {
            width: auto;
            margin: 0;
            padding: 1em;
            text-align: right;
            .k-button {
                margin-left: 0.5em;
                &:first-child {
                    margin-left: 0;
                }
            }
        }
    }
}

.k-rtl {
    .k-grid-header .k-header:first-child,
    .k-filter-row th:first-child,
    .k-grid tbody td:first-child,
    .k-grid tfoot td:first-child {
        border-left-width: 0;
    }
}

.k-rtl .k-dialog {
    .k-window-titlebar {
        .k-dialog-title {
            padding-right: 1em;
            padding-left: 2em;
        }
    }
    a.k-dialog-action.k-dialog-close {
        left: 0;
    }
    .k-dialog-buttongroup {
        &.k-dialog-button-layout-stretched {
            .k-button:first-child {
                border-bottom-right-radius: @border-radius;
            }
            .k-button:last-child {
                border-bottom-left-radius: @border-radius;
            }
        }
        &.k-dialog-button-layout-normal {
            text-align: left;
            .k-button {
                margin-left: 0;
                margin-right: 0.5em;
                &:first-child {
                    margin-right: 0;
                }
            }
        }
    }
}

.k-numeric-wrap .k-i-warning {
    color: @input-validation-error;
    position: absolute;
    top: 0;
    right: 2.2em;
    width: 2.2em;
}

.k-numeric-wrap.k-state-invalid {
    border-color: @input-validation-error;

    input {
        color: @input-validation-error;
    }
}

.k-rtl .k-numeric-wrap.k-state-invalid .k-i-warning {
    right: auto;
    left: 2.2em;
}

.k-maskedtextbox.k-state-invalid {
    .k-textbox {
        border-color: @input-validation-error;
        color: @input-validation-error;
    }

    .k-i-warning {
        color: @input-validation-error;
    }
}

.k-dateinput.k-state-invalid {
    .k-textbox {
        color: @input-validation-error;
        border-color: @input-validation-error;
    }

    .k-i-warning {
        margin-left: 0;
        margin-right: 0.8em;
        color: @input-validation-error;
    }
}

.k-rtl .k-dateinput .k-i-warning {
    margin-right: 0;
    margin-left: 0.8em;
}

.k-datepicker .k-picker-wrap,
.k-timepicker .k-picker-wrap {
    &.k-state-invalid {
        border-color: @input-validation-error;

        .k-input {
            color: @input-validation-error;
        }
    }

    .k-i-warning {
        color: @input-validation-error;
        margin-left:0;
        margin-right: 2.8em;
    }

    .k-rtl & {
        .k-i-warning {
            margin-right: 0;
            margin-left: 2.8em;
        }
    }
}

.k-datetimepicker .k-picker-wrap {
    &.k-state-invalid {
        border-color: @input-validation-error;

        .k-input {
            color: @input-validation-error;
        }
    }

    .k-i-warning {
        color: @input-validation-error;
        margin-left:0;
        margin-right: 5.3em;
    }

    .k-rtl & {
        .k-icon.k-i-warning {
            margin-right: 0;
            margin-left: 5.3em;
        }
    }
}

.k-listbox {
    .k-list-scroller {
        margin: 0;
        border-color: @widget-border-color;
        background-color: @background;
    }

    .k-item {
        padding: 1px 11px;
        color: @normal-text-color;

        &:hover:not(.k-state-disabled) {
            background-color: @hover-background;
        }

        &.k-state-selected {
            color: @selected-text-color;
            background-color: @selected-background;
            border-color: transparent;

            &:hover {
                background-color: multiply(@accent, #cccccc);
            }
        }

        &.k-state-disabled {
            color: @disabled-text-color;
        }

        &.k-state-focused {
            border-color: darken(@widget-border-color, 27%);
            box-shadow: none;
        }
    }

    .k-button.k-state-disabled:active .k-icon {
        opacity: .2;
    }

    .k-button.k-state-disabled:active .k-icon {
        opacity: .2;
    }

    .k-drop-hint {
        height: 0;
        border-top: 1px solid @accent;
    }
}

.k-item.k-state-selected.k-drag-clue {
    color: @selected-text-color;
    background-color: @selected-background;
}

.k-grid-header {
    .k-i-sort-asc-sm,
    .k-i-sort-desc-sm,
    .k-i-sort-asc-sm:hover,
    .k-i-sort-desc-sm:hover,
    .k-sort-order {
        color: @accent;
        opacity: 1;
        margin-bottom: -1px;
    }
}

.k-menu-scroll-button {
    border-width: 0;
    box-shadow: none;
    border-color: @widget-border-color;
    background-color: @base;
}

.k-menu-scroll-wrapper.horizontal {
    .k-scroll-left { border-right-width: 1px; }
    .k-scroll-right { border-left-width: 1px; }
}
.k-menu-scroll-wrapper.vertical {
    .k-scroll-up { border-bottom-width: 1px; }
    .k-scroll-down { border-top-width: 1px; }
}
